<template>
  <div>
    <h1>{{name}}--{{age}}</h1>
    <AAA @setage='setage' :uname='name' :age='age'></AAA>
  </div>
</template>

<script>
import { reactive, toRefs } from 'vue'
import AAA from '@/views/a.vue'
export default {
  components: {
    AAA
  },
  setup () {
    const obj = reactive({
      name: 'zp',
      age: 18
    })

    const setage = (val) => {
      obj.age = val
    }
    return {
      ...toRefs(obj),
      setage
    }
  }
}

</script>

<style>
</style>
